<div id="content">
  <div id="profile-tb">
    <div id="title">
      <h1>编辑个人资料</h1>
      <p class="tips">多背一公斤是一个真实的线下活动，希望您填写真实的个人资料</p>
    </div>
    <ul id="tabnav" class="profile-nav">
			<li class="current" id="offline-li"><a href="javascript:show_form('offline')" title="真实资料">真实资料</a></li>
			<li id="online-li"><a href="javascript:show_form('online')" title="头像和网上据点">头像和网上据点</a></li>
		</ul>
    <div id="offline-form" class="form-tb">
      <% form_for :profile, :url => {:controller => 'profiles', :action => 'update_offline'} do |f| -%>
      <table border="0" cellspacing="5" cellpadding="5" align="center" style="padding:10px;margin:10px auto;font-size:0.8em">
        <tr>
          <td width="80" class="right">姓</td>
          <td width="250"><%= f.text_field :last_name %></td>
        </tr>
        <tr>
          <td width="80" class="right">名</td>
          <td width="250"><%= f.text_field :first_name %></td>
        </tr>
        <tr>
          <td width="80" class="right">性别</td>
          <td width="250"><%= f.select :sex, {"男"=>1, "女"=>2}, {:include_blank => true} %></td>
        </tr>
        <tr>
          <td width="80" class="right">所在学校</td>
          <td width="250"><%= f.text_field :school_name %></td>
        </tr>
        <tr>
          <td width="80" class="right">年级</td>
          <td width="250"><%= f.text_field :class_level %></td>
        </tr>
        <tr>
          <td width="80" class="right">专业</td>
          <td width="250"><%= f.text_field :major %></td>
        </tr>
      </table>
      <p style="text-align:center;"><%= submit_tag '保存' %></p>
      <% end -%>
    </div>
    <div id="online-form" class="form-tb" style="display:none">
      <% form_tag({:action => "update_online", :id => current_user}, :multipart => true) do %>
      <table border="0" cellspacing="5" cellpadding="5" align="center" style="padding:10px;margin:10px auto;font-size:0.8em">
        <tr>
          <td width="120" class="right">我现在的头像</td>
          <td width="250"><%= image_tag (url_for_file_column 'current_user', 'avatar_url', 'medium') if current_user.avatar_url %></td>
        </tr>
        <tr>
          <td width="120" class="right">上传头像</td>
          <td width="250"><%= file_column_field 'user', 'avatar_url' %></td>
        </tr>
      </table>
      <table border="0" cellspacing="5" cellpadding="5"  align="center" style="padding:10px;margin:10px auto;font-size:0.8em">
        <tr><th>我的网上据点</th></tr>
        <tr>
          <td width="120" class="right"><img src="/images/delicious.png" /> <a href="http://del.icio.us" target="_blank">del.icio.us</a></td>
          <td width="250"><%= text_field 'user', 'delicious_url', :value => current_user.delicious_url %></td>
        </tr>
        <tr>
          <td width="120" class="right"><img src="/images/douban.png" /> <a href="http://www.douban.com" target="blank">豆瓣</a></td>
          <td width="250"><%= text_field 'user', 'douban_url', :value => current_user.douban_url %></td>
        </tr>
        <tr>
          <td width="120" class="right"><img src="/images/yupoo.png" /> <a href="http://www.yupoo.com" target="_blank">又拍</a></td>
          <td width="250"><%= text_field 'user', 'yupoo_url', :value => current_user.yupoo_url %></td>
        </tr>
        <tr>
          <td width="120" class="right"><img src="/images/fanfou.png" /> <a href="http://fanfou.com" target="_blank">饭否</a></td>
          <td width="250"><%= text_field 'user', 'fanfou_url', :value => current_user.fanfou_url %></td>
        </tr>
        <tr>
          <td width="120" class="right"><img src="/images/twitter.png" /> <a href="http://twitter.com" target="_blank">twitter</a></td>
          <td width="250"><%= text_field 'user', 'twitter_url', :value => current_user.twitter_url %></td>
        </tr>
      </table>
      <p style="text-align:center"><%= submit_tag "保存" %></p>
      <% end %>
    </div>
  </div>
</div>
<script type="text/javascript">
function show_form(id) {
  Element.hide('online-form');
  Element.hide('offline-form');
  Element.show(id+'-form');
  
  // change tabnav's style
  $('online-li').className = '';
  $('offline-li').className = '';
  $(id+'-li').className = 'current';
}
</script>